<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>背景颜色</title>

    <style>
        div{
            width: 100px;
            height: 100px;
        }

        .name{
            background-color: tomato;
        }

        .jinzhi{
            background-color: #0ff;
        }

        .rgb{
            background-color:rgb(255,255,0);
        }

        .rgba{
            background-color: rgba(255,255,0,0.5);
        }

        .hsl{
            background-color: hsl(180deg,50%,50%);
        }

        .hsla{
            background-color: hsla(180,100%,50%,0.5);
        }

        /*透明度*/
        .transparent{
            border: 1px solid red;
            background-color: transparent;
        }
    </style>


</head>
<body>


<div class="name"></div>
<div class="jinzhi"></div>
<div class="rgb"></div>
<div class="rgba"></div>
<div class="hsl"></div>
<div class="hsla"></div>
<div class="transparent"></div>

</body>
</html>